<template>
    <div style="height: 100%">
      <div class="main-tab">
        <x-header id="header" slot="header" :left-options="{showBack: false}" >
          <x-icon type="ios-arrow-back" slot="left" style="fill:#fff;" @click="back"></x-icon>
          <span slot="default" class="header-tit">详情</span>
        </x-header>
        <div class="main-headerAndTab">
          <group gutter="0">
            <x-textarea style="height: 16.57rem" readonly v-model="list.content">
            </x-textarea>
          </group>
          <group>
            <cell value-align="left">
              <span slot="title" class="tit">采购预算:</span>
              <span style="font-size: 14px;color: #9B9B9B;letter-spacing: -0.34px;text-align: justify;"><span class="content">{{list.budget}}</span>元</span>
            </cell>
            <cell value-align="left">
              <span slot="title" class="tit">收货城市:</span>
              <span class="content">{{list.province}}{{list.city}}{{list.district}}</span>
            </cell>
            <cell value-align="left">
              <span slot="title" class="tit">发票需求:</span>
              <span class="content" v-if="list.invoiceType ===1">不用发票</span>
              <span class="content" v-if="list.invoiceType ===2">增值税普通发票</span>
              <span class="content" v-if="list.invoiceType ===3">增值税专用发票</span>
            </cell>
            <cell value-align="left">
              <span slot="title" class="tit">联系方式:</span>
              <span class="content">{{list.mobile}}</span>
            </cell>
          </group>
        </div>
      </div>
    </div>
</template>

<script>
  import {XTextarea} from 'vux'
  import { getUserDemandDetail } from '@/api/need'
    export default {
        name: "needDetail",
      methods:{
        back(){
          this.$router.go(-1)
        },
        getUserDemandDetail(){
          getUserDemandDetail(this.id).then(res =>{
            console.log(res)
            this.list=res;
          })
        }
      },
      components:{
        XTextarea
      },
      data(){
          return{
            id:47 ,
            list:[],
          }
      },
      created(){
          this.getUserDemandDetail();
      }
    }
</script>

<style scoped>
  .header-tit{
    margin-top: 0.2rem;
  }
  #header{
    width: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 100;
  }
  .tit{
    font-size: 14px;
    color: #9B9B9B;
    letter-spacing: -0.34px;
    text-align: justify;
    margin-right: 0.72rem;
  }
  .content{
    font-size: 17px;
    color: #4A4A4A;
    letter-spacing: -0.41px;
    text-align: justify;
    margin-right: 0.36rem;
  }
</style>
